<template>
	<view>
		<image mode="widthFix" class="image posiab" src="/static/xaing.png"></image>
		<view class="posiab zindex5" :style="{paddingTop:shh+'px'}">
			<view @click="back"  class="flex-ju-c mt30 wh70-70 ra100 mt30 ml30 ">
				<view  class="" >
					<image mode="widthFix" class="image width32   " src="/static/back.png"></image>
				</view>
			</view>
		</view>
		<view class="colorfff posire  pt19vh">
			<view class="flex-ju-c">
				<image v-if="info.is_box==1" class="image wh465-465 ra20" src="/static/box.png"></image>
				<image v-else class="image wh465-465 ra20" :src="info.thumb"></image>
			</view>
			<view class="flex-ju-c size31 mt150">{{info.title}}</view>
			<view class="flex-ju-c mt30">
			<view 
				class="flex-a-i size24 borderccc ra10 hidden mr20">
				<view class="ibgtoCAF881-A0E99A color000 pt5 pb5 pl10 pr10">限量</view>
				<view class="pr10 pl10 size28">{{info.sell_num}}份</view>
			</view>
			<view
				class="flex-a-i size24 borderccc ra10 hidden ml20">
				<view class="ibgtoCAF881-A0E99A color000 pt5 pb5 pl10 pr10">流通</view>
				<view class="pr10 pl10 size28">{{info.release_num}}份</view>
			</view>
			</view>
			<view class="bgfff mt50 pg30 color000" style="border-top-right-radius: 40rpx;border-top-left-radius: 40rpx;">
				<!-- <view class="flex-a-i">
					<image src="/static/aaa.png" class="wh83-83 ra83"></image>
					<view class="ml20">
						<view class="size26">创作者的名字</view>
						<view class="color999 size25">500粉丝</view>
					</view>
				</view> -->
				<view v-if="!num" class="borderE1E1E1 flex-ju-b size26 ra20 pg30-20 mt20">
					<view>产品编号 #{{hao(info.nftId)}}</view>
					<view @click="back()" class="size25 flex-ju-c bg000 wh140-50 colorfff ra10">其他寄售</view>
				</view>
				
				<!-- <view v-if="info.is_box==1" class="bgF5F6F7 size26 ra20 pg30-20 mt20">
					<view class="size30 bold">盲盒信息</view>
					<scroll-view scroll-x class="mt30">
						<view class="flex center">
							<view class="mr20" v-for="(item,u) in info.box_info" :key="u">
								<image :src="item.thumb" class="wh185-185 ra15"></image>
								<view class="one">{{item.title}}</view>
								<view class="color999">{{item.odds}}%</view>
							</view>
						</view>
					</scroll-view>
				</view> -->
				<view v-if="!num"  class="borderE1E1E1 size26 ra20 pg30-20 mt20">
					<view class="size30 bold">链上信息</view>
					<view class="flex-ju-b mt20 ">
						<view class="color999">所在产链</view>
						<view  class="color35B1FF">
						{{info.link_name}}</view>
					</view>
					<view class="flex-ju-b mt20">
						<view  class="color999">合约地址</view>
						<view :class="theme?'color999':'color333'" >
						{{info.link_address.substring(0,3)}}****{{info.link_address.substring(info.link_address.length-3,999)}}</view>
					</view>
					<view class="flex-ju-b mt20">
						<view  class="color999">支付钱包</view>
						<view :class="theme?'color999':'color333'">{{info.pay_type}}</view>
					</view>
					<view class="flex-ju-b mt20">
						<view  class="color999">发行时间</view>
						<view :class="theme?'color999':'color333'">{{info.created_at}}</view>
					</view>
				</view>
				
				<view  class="borderE1E1E1 size26 ra20 pg30-20 mt20 mb150">
					<!-- <view class="size30 bold mb20">藏品详情</view>
					<image mode="widthFix" class="image" v-for="(item,index) in info.images" :src="item"></image> -->
					<view class="size30 bold mb20 ">购买须知</view>
					<view class="color999">
						<view class="mb30">
							数字藏品交易仅限于18周岁(不含)以上、60周岁(含)以下，并已完成实名认证的中国大陆用户购买。由于不同属性的数字艺术有不同的二次交易规则，请您仔细阅读并同意相关规则后再进行相应操作，以避免不必要的损失。
						</view>
						请注意，一旦数字藏品完成出售，不支持退货在购买之前，请仔细考虑您的购买决策。根据我国相关的法律要求，特定条件下的数字藏品的二次交易不支持任何形式的变相炒作。我们坚决反对数字藏品炒作、场外交易、欺诈，以及其他非法侵权行为。请您甄别上述涉嫌网络欺诈的行为并了解相关风险。
					</view>
				</view>
				
				<view class=" posifi width92vw bottom0 " >
					<view class="ra20 flex-ju-b pg30 bgfff height80"  style="box-shadow: 0rpx -8rpx 24rpx 0rpx rgba(0,0,0,0.06);">
						<view class="bold size62  " >
							<text class="size31">¥ </text> {{info.money_price / 100}}<text class="size31">/{{num}}件</text>
						</view>
						<template v-if="uuid">
							<view v-if="info.status == 5"  class="bold wh330-100 bgccc colorfff ra20 flex-ju-c   size29  ">
									锁定中
							</view>
							<view v-else @click="navto('order?uuid='+uuid)"  class="bold wh330-100 bg000 colorfff ra20 flex-ju-c   size29  ">
								立即购买
							</view>
						</template>
						<view v-else @click="$refs.mima.open()"  class="bold wh330-100 bg000 colorfff ra20 flex-ju-c   size29  ">
							出售
						</view>
						
					</view>
				</view>
			</view>
		</view>
		
		<uni-popup type="center" background-color="#fff" border-radius="20px 20px" ref="mima">
			<view class="pt40 pb40 posire">
				<view class="flex-ju-c">
					<image mode="widthFix" src="/static/tancc.png" class="width127 posiab top-60"></image>
				</view>
				<view class="flex-ju-c size29  mb50 mt80">
					<view>请输入交易密码</view>
				</view>
				<xsk-code-input width="84" height="84" @confirm="inputConfirm"></xsk-code-input>
				
				<!-- <view class="flex-ju-b">
					<view class="flex-ju-b size24 ml80 mt30">
						<view>出售数量</view>
						<view :class="theme?'bg141414 colorfff':'bgfff'" class="flex-a-i borderededed center ml30 ra30">
							<view @click="tapnumebrs(1)" :style="{borderRight:theme?'1px solid #292929':'1px solid #F5F6F7'}" class="wh48-48 flex-ju-c">-</view>
							<view>
								<input class="width95 " :class="theme?' colorfff':'color000'" v-model="number" />
							</view>
							<view @click="tapnumebrs(2)" :style="{borderLeft:theme?'1px solid #292929':'1px solid #F5F6F7'}" class="wh48-48 flex-ju-c ">+</view>
						</view>
					</view>
					<view></view>
				</view> -->
				<view @click="navto('/pages/user/password?type=level2password')" class="flex-ju-c color999 size24 mt40" style="text-decoration: underline">
					未设置交易密码或忘记密码？
				</view>
				<view class="flex-ju-c flex-col mt50 ">
					<view @click="tapword" class="bold srgb bg000 colorfff wh530-100 ra20 flex-ju-c">确认</view>
					<view @click="$refs.mima.close()" class="bold srgb wh694-100 ra100 flex-ju-c">取消</view>
				</view>
				
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				theme: uni.getStorageSync('theme'),
				timer: "",
				info: {},
				inputVerificationChange:"",
				uuid:"",
				current:'',
				pid:"",
				number:1,
				num:"",
				price:"",
				id:"",
				package_sku_id:"",
				skuinfo:""
			}
		},
		mounted() {
			// this.$refs.mima.open()
		},
		onLoad(e) {
			if(e.uuid){
				this.uuid=e.uuid
				this.http(`resales/info/${e.uuid}`).then(res => {
					this.info = res.data
				})
			}else{
				this.id  = e.id
				this.current = e.current
				this.pid = e.pid
				this.price = e.price
				this.num = e.num
				this.http('market/resales', {
					page: 1,
					per_page: 1,
					product_id: e.id
				}).then(res => {
					res.data.info.money_price = e.price
					this.info = res.data.info
					this.package_sku_id = res.data.list[0].package_sku_id
					this.skuinfo = res.data.list[0]
				})
			}
			
		},
		methods: {
			tapnumebrs(index) {
				if (index == 1) {
					if (this.number > 1) {
						this.number--
					}
				} else {
					this.number++
				}
			},
			inputConfirm(e){
				this.inputVerificationChange = e
			},
			tapword() {
					if (this.inputVerificationChange.length != 6) {
						uni.showToast({
							title:"二级密码格式不正确",
							icon:"none"
						})
						return
					}
					if (this.current == 1) {
						this.http('want/getWant', {
							product_id: this.id,
							want_id: this.pid,
							level2password: this.inputVerificationChange,
							num:this.num
						},'post').then(res => {
							uni.reLaunch({
								url:'suuchu?id='+this.id+'&price='+res.data.money_price
							})
							inputVerificationChange.value = ''
						})
					} else {
						this.http('bidding/getBidding', {
							product_id: this.id,
							bidding_id: this.pid,
							level2password: this.inputVerificationChange,
							num:this.num,
							package_sku_id:this.package_sku_id
						},'post').then(res => {
							uni.reLaunch({
								url:'suuchu?id='+this.id+'&price='+res.data.money_price
							})
							inputVerificationChange.value = ''
						})
					}
			
				}
		}
	}
</script>


<style>

</style>
